﻿<!doctype html>
<head>
	<meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
	<title>Chat</title>
	<link rel = "stylesheet" type = "text/css" href = "static/css/chat.css"/>
	<script type="text/javascript" src="static/js/common.js"></script>
	<script type="text/javascript">

		function MaxBottom(){
			var div = document.getElementById('msg_area_id');
			var div2 = document.getElementById('main_id');
			var div3 = document.getElementById('fun_area_id');
			div.scrollTop = div.scrollHeight;
			div2.scrollTop = div2.scrollHeight;
		}


function Logout()
 {
 var xmlHttp;
 var name = getCookie("ailiaousrname");
 deleteCookie("ailiaousrname");
 try
    {
    xmlHttp=new XMLHttpRequest();
    }
 catch (e)
    {

   try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
   catch (e)
      {

      try
         {
         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         }
      catch (e)
         {
         alert("No support AJAX");
         return false;
         }
      }
    }
    xmlHttp.open("POST","/logout",true);
    xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    var gender = getCookie("gender");
    var roomid = getCookie("roomid");
    xmlHttp.send(info+","+gender+","+roomid);
    xmlHttp.onreadystatechange=function()
    {
    	if(xmlHttp.readyState==4 && xmlHttp.status == 200)
    	{
    		//document.bodyleft.innerHTML = xmlHttp.responseText;
    	}
    }
 };

	function Init()
	{
		//权限检查
		var usrname = getCookie("ailiaousrname");
		if(trim(usrname) == "")
		{
			alert("对不起,不能直接访问该URL");
			window.location.href = "/";
		}
		//如果正常，加载在线列表
		loadonlineusr(getCookie("roomid"),false);
		document.myForm.msg.focus();
		updatemsg();
	}

//flag=false是追加，反之是刷新重写
	function loadonlineusr(roomid,flag)
 {
 var xmlHttp;
 try
    {
    xmlHttp=new XMLHttpRequest();
    }
 catch (e)
    {

   try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
   catch (e)
      {

      try
         {
         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         }
      catch (e)
         {
         alert("No support AJAX");
         return false;
         }
      }
    }

    xmlHttp.open("GET","/getonline/"+roomid,true);
    xmlHttp.send("");
    xmlHttp.onreadystatechange=function()
    {
    	if(xmlHttp.readyState==4 && xmlHttp.status == 200)
    	{
						var data=trim(xmlHttp.responseText);
						if(data == "-1")
						{
							alert("对不起,不能直接访问该URL");
							window.location.href = "/";
						}
						var obj = eval(xmlHttp.responseText);
						if(flag == true)
						{
							//重写在线列表
							document.getElementById("namelist").innerHTML = "";
						}
						for(var i=0; i<obj.length; ++i)
						{
							var name = obj[i].name;
							var gender = obj[i].gender;
							addList(name,gender);
						}
    	}
    }
 }

	</script>
</head>
<body onUnload="Logout()" onLoad="Init()">
<script type="text/javascript" src="static/js/common.js"></script>

<script type="text/javascript">

	function sendmsg()
 {
 	//alert("enter");
 var xmlHttp;
 var info = document.myForm.msg.value;
 if(trim(info) == "")
 {
 	alert("请输入您要说的话!");
 	return;
 }
 var h = document.getElementById("friendlist");
 var obj = h.options[h.selectedIndex].value;
 var myname = getCookie("ailiaousrname");
 obj = trim(obj);
 if(obj == myname)
 {
 	alert("对不起,您不能自言自语!");
 	return;
 }
 send2public(obj,info);
 try
    {
    xmlHttp=new XMLHttpRequest();
    }
 catch (e)
    {

   try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
   catch (e)
      {

      try
         {
         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         }
      catch (e)
         {
         alert("No support AJAX");
         return false;
         }
      }
    }
    xmlHttp.open("POST","/update/"+getCookie("ailiaousrname"),true);
    xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    xmlHttp.send(info);
    xmlHttp.onreadystatechange=function()
    {
    	if(xmlHttp.readyState==4 && xmlHttp.status == 200)
    	{
    		document.bodyleft.innerHTML = xmlHttp.responseText;
    	}
    }
    document.myForm.msg.value='';
    document.myForm.msg.focus();
	MaxBottom();
 };
//textarea enter send
function sendtextareamsg()
{
if(event.ctrlKey && event.keyCode == 13 )
 {
  var selectText = document.selection.createRange();
  if(selectText)
  {
   if(selectText.text.length > 0)
    selectText.text += "\r\n";
   else
    selectText.text = "\r\n";
   selectText.select();
  }
 }
 else if(event.keyCode == 13&& !event.ctrlKey)
 {
  sendmsg();
  return false;
 }
}

function getmsg()
 {
 var xmlHttp;
 try
    {
    xmlHttp=new XMLHttpRequest();
    }
 catch (e)
    {

   try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
   catch (e)
      {

      try
         {
         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         }
      catch (e)
         {
         alert("No support AJAX");
         return false;
         }
      }
    }
		xmlHttp.open("GET","/update",true);
    xmlHttp.send("1");

    xmlHttp.onreadystatechange=function()
      {
      if(xmlHttp.readyState==4)
        {
        	var objs = eval(xmlHttp.responseText);
        	var sent2 = objs[0].usr;
        	var msg = objs[0].msg;
        	var handler = document.getElementById();
        	/*
        	for(var i=0; i<3; ++i)
        	{
        		var insertTd = insertTr.insertCell(i);
        		insertTd.innerHTML = objs[0].time;
        	}
        	*/
          //document.getElementById("myscreen").innerHTML = xmlHttp.responseText;
        }
      }
 }

  function updatemsg()
 {
 	var timer_update = setInterval("getmsg();",1000);
 	var timer_refreshonline = setInterval("loadonlineusr(getCookie('roomid'),true);",1000*60);
 }

		function send2public(obj,msg)
		{
			var handler = document.getElementById('screen');
			var now_time = new Date();
			var hours = now_time.getHours();
			var minutes = now_time.getMinutes();
			var seconds = now_time.getSeconds();
			var myname = getCookie("ailiaousrname");
			var timer = "";
			timer += (hours < 10 ? "0" : "") + hours;
			timer += (minutes < 10 ? ":0" : ":") + minutes;
			timer += (seconds < 10 ? ":0" : ":") + seconds;

			timer = "["+timer+"]";
			xx = "<a href = '####' onclick='clickhref(this.innerHTML)'>"+myname +" </a>" + "对 " +"<a href = '####' onclick='clickhref(this.innerHTML)'>" + obj +" </a>"+ "说:";   //the name
			flag = 0; //male0 female1
			say = "<br><font style='color:purple; font-size:16px'>"+msg+"<font><br>";  //the content
			handler.innerHTML += timer+xx+say;
			//document.write(xx ," ",timer,"<br>",say,"<br>");
		}

 function clickhref(name)
 {
 	addobject(name);
 	document.myForm.msg.value='';
  document.myForm.msg.focus();
 }
 function addobject(usrname)
 {
 	usrname = trim(usrname);
 	var handler = document.getElementById("friendlist");
 	var optionlen = handler.options.length;
 	var flag=false;
 	for(var i=0; i<optionlen; ++i)
 	{
 		if(handler.options[i].value == usrname)
 		{
 			flag = true;
 			handler.options[i].selected = true;
 			break;
 		}
 	}
 	if(flag == false)
 	{
 		handler.options.add(new Option(usrname,usrname));
 		handler.options[optionlen].selected = true;
 	}
 }

function getCookie(c_name)
{
if(document.cookie.length>0){
   c_start=document.cookie.indexOf(c_name + "=")
   if(c_start!=-1){
     c_start=c_start + c_name.length+1
     c_end=document.cookie.indexOf(";",c_start)
     if(c_end==-1) c_end=document.cookie.length
     return unescape(document.cookie.substring(c_start,c_end))
   }
}
return "";
}

function addList(name,gender)
{
	var handler = document.getElementById("namelist");
	var sex = "[男]";
	if(gender == "0")
	{
		sex = "[女]";
	}

	handler.innerHTML += "&nbsp;"+sex+"&nbsp;<a href = '####' onclick='clickhref(this.innerHTML)'>"+name+"</a>"+" <br>";

}
</script>
	<div class="main" id="main_id">
		<div class="msg_area" id="msg_area_id">
			<div id="head">
			Welcome to ailiao-room!
			</div>
			<div id="screen">
			</div>
		</div>

		<div class="name_area">
			<script type="text/javascript">
				document.write("&nbsp;<b>[在线列表]</b><br><br>");
			</script>
			<div id="namelist">
			</div>
		</div>

		<div class="fun_area" id="fun_area_id">
			/*this is private screen*/
		</div>
		<div class="func">
			<br><label>Object:</label>
			<select id="friendlist" size="1" align="left" >
				<option>All</option>
			</select>
		</div>

		<!--<div class="send_area">
						<label><b>Object:</b></label>&nbsp;
						<select id="friendlist" size="1" align="left" >
							<option>All</option>
						</select>
						<br><br>
						<form method="post" name="myForm">
						<label><b>Message:</b></label>
						<input type="text" size="100" name="msg" align="left" onFocus="this.value=''" onKeyDown="if(event.keyCode==13)sendmsg();" >

			<div class="send_btn_area">
				<input name="image" type="button" src="$:config.static/images/btn.gif"  value="发送" id="btn" onMouseOver="this.style.borderColor='#F8B3D0'" onMouseOut="this.style.borderColor='#7EBF4F'" onClick="sendmsg();"/>
			</div>

						<input type="text" size="0" style="visibility:hidden;" >
						</form>
		</div>-->

		<div class="send_area">
			<form action="" method="post" name="myForm">
			<div class="send_box_area">
				<textarea name="msg" id="textarea_id" style="border:0" rows="2" onFocus="this.value=''" onKeyDown="return sendtextareamsg();"></textarea>

			</div>

			<div class="send_btn_area">
				<input name="image" type="button" value="发送" id="btn" onMouseOver="this.style.borderColor='#F8B3D0'" onMouseOut="this.style.borderColor='#7EBF4F'" onClick="sendmsg();"/>
			</div>
			</form>
		</div>

	</div>
</body>
